<template>
  <baseCard :title="title">
    <template #content>
      <div class="content">
        <el-row :gutter="20">
          <el-col :span="12" v-for="item in advantageList" class="advantage">
            <AdvantageCard :info="item" />
          </el-col>
        </el-row>
      </div>
    </template>
  </baseCard>
</template>

<script lang="ts" setup name="ServerProject">
import AdvantageCard from '@/components/advantageCard/index.vue'
import baseCard from '@/components/baseCard/index.vue'

const title = '服务项目 '

const advantageList = [
  {
    title: '资深技术团队',
    img: 'https://www.dlsibo.com/img/Home_team.png',
    describe: '专业的开发团队和10余年的软件开发经验，为每一个项目建立开发小组成为您专属的研发团队。'
  },
  {
    title: '高性价比',
    img: 'https://www.dlsibo.com/img/Home_team.png',
    describe:
      '定制软件会根据开发企业所需要的功能模块，删除不需要的功能，最大限度的节省开发费用，安排明确，计费透明。'
  },
  {
    title: '量身定制',
    img: 'https://www.dlsibo.com/img/Home_team.png',
    describe: '梳理客户具体需求，结合用户与市场情况量身打造合理产品方案。'
  },
  {
    title: '服务周到',
    img: 'https://www.dlsibo.com/img/Home_team.png',
    describe: '软件使用过程中出现的问题，急速呼应沟通测试，为您提供专业，迅捷的服务。'
  }
]
</script>

<style lang="less" scoped>
.advantage {
  margin: 20px 0;
}

.content {
  width: 1320px;
}

.el-row {
  margin-bottom: 20px;
}
.el-row:last-child {
  margin-bottom: 0;
}
.el-col {
  border-radius: 4px;
}
</style>
